
<svg width="120" height="140">
<!-- symbol definition  NEVER draw -->
<symbol id="sym01" viewBox="0 0 100 100">
  <circle cx="50" cy="50" r="40" stroke-width="8"
      stroke="red" fill="red"/>
  <circle cx="90" cy="60" r="40" stroke-width="8"
      stroke="green" fill="white"/>
</symbol>

<!-- actual drawing by "use" element -->
<use href="#sym01"
     x="0" y="0" width="100" height="50"/>
<use href="#sym01"
     x="0" y="50" width="75" height="38"/>
<use href="#sym01"
     x="0" y="100" width="50" height="25"/>
</svg>